import { createRouter, createWebHashHistory } from 'vue-router'
//定义路由信息的数组
const routes = [
  //首页
  {
    path: '/',
    name: 'FirstPage',
    component: () => import('../views/FirstPage.vue'),
  },
  //登录页
  {
    path: '/login',
    name: 'LoginForm',
    component: () => import('../views/LoginForm.vue'),
  },
  {
    path: '/more-table-column',
    name: 'MoreTableColumn',
    component: () => import('../views/MoreTableColumn.vue'),
  },
  {
    path: '/option',
    name: 'Option',
    component: () => import('../views/OptionSetting.vue'),
  },
  {
    path: '/:catchAll(.*)',
    name: 'ResigterForm',
    component: () => import('../views/FoundError.vue'),
  },
  {
    path: '/layout',
    name: 'Layout',
    component: () => import('../views/LayoutPage.vue'),
    //二级路由
  },
  {
    path: '/register',
    name: 'Register',
    component: () => import('../views/LoginRegister.vue'),
  },
  {
    path: '/income',
    name: 'Income',
    component: () => import('../views/IncomeReport.vue'),
  },
  {
    path: '/check1',
    name: 'Check1',
    component: () => import('../views/ClickShow.vue'),
  },
  {
    path: '/test',
    name: 'Text',
    component: () => import('../views/test.vue'),
  },

  {
    path: '/second',
    name: 'SecondPage',
    component: () => import('../views/SecondPage.vue'),
  },
  {
    path: '/table',
    name: 'page',
    component: () => import('../views/TableBorder.vue'),
  },
  {
    path: '/menu',
    name: 'Menu',
    component: () => import('../views/MenuLayout.vue'),
    children: [
      // {
      //   path: 'role',
      //   name: 'Role',
      //   component: () => import('../views/role/QiMo.vue'),
      // },
      {
        path: 'role',
        name: 'Role',
        component: () => import('../views/role/QiMo.vue'),
      },
      //账户管理
      {
        path: 'admin',
        name: '/Admin',
        component: () => import('../views/admin/AdminRole.vue'),
      },
      {
        path: 'home',
        name: '/Home',
        component: () => import('../views/home/HomePage.vue'),
      },
    ],
  },
  {
    path: '/lay',
    name: 'Lay',
    component: () => import('../views/LayoutShow.vue'),
  },
]
//导入nprogress.js
import Nprogress from 'nprogress'
//导入nprogress的样式
import 'nprogress/nprogress.css'
//创建一个路由器对象
const router = createRouter({
  history: createWebHashHistory(),
  routes,
})

//定义路由导航前置守卫
router.beforeEach((to, form, next) => {
  Nprogress.start()
  next()
})
//定义路由导航后置守卫
router.afterEach((to, form) => {
  Nprogress.done()
})
export default router
